<template>
	<view class="page">
		<image src="../../static/register/top2.jpg" mode="widthFix" class="top" />
		<view class="location-container">
			<view class="left">
				<image src="../../static/register/location.png" mode="widthFix" class="location"></image>
				<text>代驾服务地点</text>
			</view>
			<view class="right">{{provinceName}} - {{cityName}}</view>
		</view>
		<view class="info-container">
			<view class="title-container">
				<image src="../../static/register/title-bg.png" mode="widthFix" class="title-bg"></image>
				<text class="title">注册条件</text>
			</view>
			<view class="list">
				<view class="item">
					<text>1.</text>
					车辆合规合法；
				</view>
				<view class="item">
					<text>2.</text>
					年龄18岁以上；
				</view>
				<view class="item">
					<text>3.</text>
					无违法犯罪记录、无精神病史、无吸毒史，以及平台认为不适合使用代驾的其他历史证明；
				</view>
				
				
			</view>
		</view>
		<view class="info-container">
			<view class="title-container">
				<image src="../../static/register/title-bg.png" mode="widthFix" class="title-bg"></image>
				<text class="title">使用流程</text>
			</view>
			<view class="list">
				<view class="complex-item">
					<view class="left">01</view>
					<view class="right">
						<text class="item-title">在线注册账号</text>
						<text class="item-desc">在小程序完成注册</text>
					</view>
				</view>
				<view class="complex-item">
					<view class="left">02</view>
					<view class="right">
						<text class="item-title">个人信息填写</text>
						<text class="item-desc">按照流程提交本人身份证照片</text>
					</view>
				</view>
				<view class="complex-item">
					<view class="left">03</view>
					<view class="right">
						<text class="item-title">代驾下单</text>
						<text class="item-desc">通过APP下单预约代驾</text>
					</view>
				</view>
				<view class="complex-item">
					<view class="left">04</view>
					<view class="right">
						<text class="item-title">费用支付</text>
						<text class="item-desc">订单结束自动扣除费用</text>
					</view>
				</view>
			</view>
		</view>
		<button class="btn" @tap="wxLogin" >乘客注册</button>
		<!-- <button class="btn" open-type="getPhoneNumber" @getphonenumber="phoneRegister" >微信注册</button> -->
		<u-toast ref="uToast" />
	</view>
</template>

<script>
var QQMapWX = require('../../lib/qqmap-wx-jssdk.min.js');
var qqmapsdk;	
export default {
	data() {
		return {
			code: null,
			// 获取所在市
			cityName:"未知",
			// 获取所在省
			provinceName: ""
		};
	},
	onLoad(){
		let _this = this;
	
		_this.initQQMap();
		
		// 1.获取经纬度信息
		let location = _this.getLocation();
		_this.reverseGeocoder(location);
		// 2.获取城市信息
	},
	methods: {
		// 乘客注册
		wxLogin() {
			const _this = this;
			
			uni.removeStorageSync("tokenName");
			uni.removeStorageSync("tokenValue");
			uni.removeStorageSync("permissions");
			uni.removeStorageSync("loginInfo");
			
			wx.login({
				success (res) {
					if (res.code) {
						console.log(res.code);
						_this.get("/customer/app/customer/register/" + res.code, (resp) => {
							if (resp.success) {
								uni.showToast({
									icon: "success",
									title: "注册成功，请登录",
								});
								// 设置一个1000毫秒后执行的定时器
								setTimeout(function() {
									//在起始页面跳转到test.vue页面并传递参数
									uni.navigateTo({
										url: '/pages/login/login'
									});
								}, 2000);
							} else {
								uni.showToast({
									icon: "error",
									title: resp.message,
								});
							}				  
						})                                          
					} else {                                      
					  console.log('登录失败！' + res.errMsg)       
					}                                             
				}
			})
		},
		// 1.获取经纬度信息
		getLocation(){
			uni.getLocation({
				type: 'wgs84',
				success: function (res) {
					console.log('当前位置的经度：' + res.longitude);
					console.log('当前位置的纬度：' + res.latitude);
					return res;
				}
			});
		},
		// 2.初始化腾讯地图对象
		initQQMap(){
			qqmapsdk = new QQMapWX({
				key: 'VJNBZ-XGTCN-OWNFW-SSLAR-PZ4PF-OBBIY' // 必填
			}); 
		},
		// 3.逆地址解析
		reverseGeocoder(location){
			const _this = this;
			qqmapsdk.reverseGeocoder({
				location: location,
				success:(res)=>{
					console.log(res);
					if(res.status == 0){
						_this.cityName = res.result.address_component.city;
						_this.provinceName = res.result.address_component.province;
					}else {
						uni.showToast({
							icon:"error",
							title:"获取地址失败!"
						})
					}
				}
			})
		}
	}
};
</script>

<style lang="less">
@import url('register.less');
</style>
